<template>
  <AgreementView :userId="userId"></AgreementView>
  <div class="fixed-button-container">
    <el-button type="primary" class="fixed-button" @click="goBack">上一步</el-button>
    <el-button type="warning" class="fixed-button" @click="submitToSalary">提交</el-button>
  </div>
</template>

<script setup>

import AgreementView from "@/components/agreement/AgreementView.vue";
import {onBeforeMount, onMounted, ref} from "vue";
import {useRoute, useRouter} from "vue-router";
import {ElMessage} from "element-plus";
import UserBasic from "@/api/UserBasic.js";

const route = useRoute()
const router = useRouter()

const userId = ref('')

onBeforeMount(() => {
  userId.value = route.query.userId
});

const goBack = () => {
  router.back()
}

const submitToSalary = () => {
  const body = ref({
    userId: userId.value,
  })
  UserBasic.userBasicStartSalary(body.value)
      .then(res => {
        ElMessage.success('提交成功')
        router.push({ name: 'userBasicStartSalaryList'});
      })
}
</script>

<style scoped>
.fixed-button-container {
  position: fixed;
  bottom: 50px; /* 距离底部的距离 */
  left: 50%; /* 水平居中定位 */
  transform: translateX(-50%); /* 偏移量，实现水平居中 */
  display: flex;
  justify-content: center; /* 水平居中按钮 */
  align-items: center; /* 垂直居中（如果需要的话） */
  z-index: 10;
}

.fixed-button {
  margin: 0 10px; /* 按钮之间的间距 */
  padding: 10px 20px; /* 按钮的内边距 */
}
</style>